﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>Intermediate jQuery</title>
</head>
<body>
   <h1>
      Intermediate jQuery</h1>
   <hr />
   <h2>
      Scenario:</h2>
   <p>
      Provide a lookup for an optional input where the data is expensive to get. Or, perhaps the input is not optional, but if already filled in, there&#39;s no reason to get the full datasource of possibilities unless the user wants to change the value.</p>
   <hr />
   <h2>
      Solution</h2>
   <p>
      Use a jquery dialog for the lookup and only get the data if opened.</p>
   <hr />
   <h2>
      Solution Outline</h2>
   <ul>
      <li>Add input to capture user&#39;s age in dog years</li>
      <li>Add link to &quot;lookup&quot; the correct value</li>
      <li>Add a dialog that opens when the lookup link is clicked</li>
      <li>Wire event that will load the hard-coded data when the dialog first opens<ul>
         <li>Ensure only loads once</li>
         </ul>
      </li>
      <li>Add an action on the home controller to get the script data</li>
      <li>Modify open event to call the action instead of using the hard-coded data</li>
   </ul>
   <hr />
   <h2>
      References</h2>
   <p>
      <a href="http://jquery.com/">jQuery</a><br />
      <a href="http://jqueryui.com/">jQuery UI</a><br />
      <a href="http://www.json.org/js.html">JSON parser and stringifier</a></p>
   </body>
</html>
